<style lang="less">
  .itemApp1App1{
    height: 32px;
    line-height: 32px;
  }
  .row-left{
    text-align: center;
  }
  .title{
    margin-bottom:10px;
    color: #1C86EE;
    font-size: 1rem;
    border-bottom: 1px solid orangered;
    font-size: 20px;
    color: coral;
  }
  .info-middleApp{
    height: 410px;
    background-color: #F8F8FF;
    padding-left: 70px;
    padding-right: 70px;
  }
  .ivu-steps-item {
    display: initial;
    position: relative;
    vertical-align: initial;
  }
  .step-item {
    float: left;
    margin-left: 0px;
  }
  .head-img {
    height: 120px;
    width:100px;
    position:absolute;
    right:1px;
    top:10px;
  }
  .red-name{
    color: red
  }
</style>
<template>
  <div style="background-color:white">
    <div style="background-color:white">
      <Row class="title">
        <Col span="4" style="text-align: left;width:22%">动态变更救助对象</Col>
      </Row>
    </div>
    <div style="height:30px;">
      <Steps :current="0" style="margin-bottom:10px" size="small">
        <div class="step-item">
          <Step title="家庭信息" content=""></Step>
        </div>
        <div @click="nextStep('1')" class="step-item">
          <Step title="死亡停救受理" content=""></Step>
        </div>
      </Steps>
    </div>
    <div class="info-middleApp">
      <div style="width:55%;float:left">
        <Form :label-width="0" style="margin-top:10px">
          <FormItem>
            <Row class="itemApp1">
              <Col span="5" style="text-align: center" class="row-left">救助类型</Col>
              <Col span="7">
                <Select v-model="data.ssca0002" :disabled="see">
                  <Option value="100">城市低保</Option>
                  <Option value="100">农村低保</Option>
                </Select>
              </Col>
            </Row>
          </FormItem>
          <FormItem>
            <Row class="itemApp1">
              <Col span="5" style="text-align: center" class="row-left red-name">申请人证件号码</Col>
              <Col span="7">
                <Input v-model="data.azcp0001" placeholder="" :disabled="see"></Input>
              </Col>
              <Col span="5" style="text-align: center" class="row-left red-name">申请人证件类型</Col>
              <Col span="6">
                <Select v-model="data.azcp0002" :disabled="see">
                  <Option :value="obj.key" v-for="obj in data1" v-bind:key="obj.key">{{obj.value}}</Option>
                </Select>
              </Col>
            </Row>
          </FormItem>
          <FormItem>
            <Row class="itemApp1">
              <Col span="5" style="text-align: center" class="row-left red-name">户籍特别行政区</Col>
              <Col span="6">
                <Select v-model="select1" :disabled="see">
                  <Option :value="obj.id" v-for="obj in data2" v-bind:key="obj.id">{{obj.fullname}}</Option>
                </Select>
              </Col>
              <Col span="6">
                <Select v-model="select2" :disabled="see">
                  <Option :value="obj.id" v-for="obj in data3" v-bind:key="obj.key">{{obj.fullname}}</Option>
                </Select>
              </Col>
              <Col span="6">
                <Select v-model="select3" :disabled="see">
                  <Option :value="obj.code" v-for="obj in data4" v-bind:key="obj.key">{{obj.fullname}}</Option>
                </Select>
              </Col>
            </Row>
          </FormItem>
          <FormItem>
            <Row class="itemApp1">
              <Col span="5" style="text-align: center" class="row-left red-name">户籍地详细地址</Col>
              <Col span="18">
                <Input v-model="data.azdf0500" placeholder="" :disabled="see"></Input>
              </Col>
            </Row>
          </FormItem>
          <FormItem>
            <Row class="itemApp1">
              <Col span="5" style="text-align: center" class="row-left red-name">常住地行政区划</Col>
              <Col span="6">
                <Select v-model="select4" :disabled="see">
                  <Option :value="obj.id" v-for="obj in data2" v-bind:key="obj.key">{{obj.fullname}}</Option>
                </Select>
              </Col>
              <Col span="6">
                <Select v-model="select5" :disabled="see">
                  <Option :value="obj.id" v-for="obj in data5" v-bind:key="obj.key">{{obj.fullname}}</Option>
                </Select>
              </Col>
              <Col span="6">
                <Select v-model="select6" :disabled="see">
                  <Option :value="obj.code" v-for="obj in data6" v-bind:key="obj.key">{{obj.fullname}}</Option>
                </Select>
              </Col>
            </Row>
          </FormItem>
          <FormItem>
            <Row class="itemApp1">
              <Col span="5" style="text-align: center" class="row-left red-name">常住地详细地址</Col>
              <Col span="18">
                <Input v-model="data.azdf0008" placeholder="" :disabled="see"></Input>
              </Col>
            </Row>
          </FormItem>
          <FormItem>
            <Row class="itemApp1">
              <Col span="5" style="text-align: center" class="row-left red-name">所属地行政区划</Col>
              <Col span="6">
                <Select v-model="select7" :disabled="see">
                  <Option :value="obj.id" v-for="obj in data2" v-bind:key="obj.key">{{obj.fullname}}</Option>
                </Select>
              </Col>
              <Col span="6">
                <Select v-model="select8" :disabled="see">
                  <Option :value="obj.id" v-for="obj in data7" v-bind:key="obj.key">{{obj.fullname}}</Option>
                </Select>
              </Col>
              <Col span="6">
                <Select v-model="select9" :disabled="see">
                  <Option :value="obj.code" v-for="obj in data8" v-bind:key="obj.key">{{obj.fullname}}</Option>
                </Select>
              </Col>
            </Row>
          </FormItem>
        </Form>
      </div>
      <div style="width:45%;float:left;position:relative;">
        <Form :label-width="0" style="margin-top:10px">
          <FormItem>
            <Row class="itemApp1">
              <Col span="6" style="text-align: center" class="row-left red-name">申请人姓名</Col>
              <Col span="8">
                <Input v-model="data.azcp0003" placeholder="" :disabled="see"></Input>
              </Col>
            </Row>
          </FormItem>
          <FormItem>
            <Row class="itemApp1">
              <Col span="6" style="text-align: center" class="row-left">户籍地邮政编码</Col>
              <Col span="8">
                <Input v-model="data.azdf0009" placeholder="" :disabled="see"></Input>
              </Col>
            </Row>
          </FormItem>
          <FormItem>
            <Row class="itemApp1">
              <Col span="6" style="text-align: center" class="row-left">宅电号码</Col>
              <Col span="8">
                <Input v-model="data.azdf0010" placeholder="" :disabled="see"></Input>
              </Col>
            </Row>
          </FormItem>
          <FormItem>
            <Row class="itemApp1">
              <Col span="6" style="text-align: center" class="row-left">常住地邮政编码</Col>
              <Col span="8">
                <Input v-model="data.azdf0502" placeholder="" :disabled="see"></Input>
              </Col>
            </Row>
          </FormItem>
          <FormItem>
            <Row class="itemApp1">
              <Col span="6" style="text-align: center" class="row-left">手机号码</Col>
              <Col span="8">
                <Input v-model="data.azdf0011" placeholder="" :disabled="see"></Input>
              </Col>
            </Row>
          </FormItem>
          <FormItem>
            <Row class="itemApp1">
              <Col span="24" style="text-align: center" class="row-left"></Col>
            </Row>
          </FormItem>
        </Form>
        <img :src="nophoto" alt="..." class="head-img">
      </div>
      <div style="height:40px;line-height:40px;float:left;margin-top:10px;margin-left:40%">
        <Button type="info" @click="next()">下一步></Button>
      </div>
    </div>
  </div>
</template>
<script>
import { getAppraising, getAdministrativePlanning, createPostNew, getBack } from '@/api/eventlist'
import nophoto from '@/assets/images/nophoto.jpeg'
export default {
  data () {
    return {
      ss17001Id: '',
      see: this.$route.params.see || false,
      operation_state: '',
      code: this.$route.params.code || '',
      url: '',
      str: this.$route.params.serialNumber || '',
      idcardNumber: this.$route.params.idcardNumber || this.$route.params.cardno,
      // idcardNumber: '371723198604123188',
      select1: '',
      select2: '',
      select3: '',
      select4: '',
      select5: '',
      select6: '',
      select7: '',
      select8: '',
      select9: '',
      temp: {
        address: '',
        address1: '',
        address2: ''
      },
      data: {
        azdf0006: '',
        ssca0002: '100',
        azcp0001: this.$route.params.idcardNumber || this.$route.params.cardno,
        ss11001Id: this.$route.params.ss11001Id || '',
        ss11002Id: this.$route.params.ss11002Id || ''
      },
      data1: [],
      data2: [],
      data3: [],
      data4: [],
      data5: [],
      data6: [],
      data7: [],
      data8: [],
      nophoto
    }
  },
  methods: {
    nextStep (step) {
      var params = {
        serialNumber: this.str,
        idcardNumber: this.idcardNumber,
        ss17001Id: this.ss17001Id,
        name: this.data.azcp0003,
        mobile: this.data.azdf0011
      }
      console.log(params)
      this.$router.push({
        name: 'deathstop',
        params: params
      })
    },
    next () {
      var params = {
        serialNumber: this.str,
        idcardNumber: this.idcardNumber,
        ss17001Id: this.ss17001Id,
        name: this.data.azcp0003,
        mobile: this.data.azdf0011
      }
      console.log(params)
      this.$router.push({
        name: 'deathstop',
        params: params
      })
    },
    getStopInsuranceInfo () {
      this.url = 'dbtb/loadAssistanceInfo'
      var params = {
        'request_map': {
          'azcp0001': this.idcardNumber
        },
        'headers_map': {
          'serialNumber': this.str,
          'idcardNumber': this.idcardNumber
        },
        'url': this.url
      }
      createPostNew(params).then(res => {
        console.log(res, '低保停保返回的数据')
        if (res.data.errcode !== 0) {
          this.$Notice.error({ title: '获取数据失败', desc: res.data.data.memo })
        } else {
          console.log(res.data.data.data)
          if (res.data.data.code === '200' && res.data.data.rescode === '0000' && res.data.data.data !== undefined) {
            console.log('有数据')
            this.data = res.data.data.data
            this.data.azcp0001 = this.idcardNumber
            this.data.ssca0002 = this.data.ssca0002 || '100'
            this.ss17001Id = this.data.ss17001Id
          } else {
            alert(res.data.data.memo)
            window.history.go(-1)
          }
          var param3 = {
            'idcardNumber': this.idcardNumber,
            'backCode': this.data.azdf0006,
            'serialNumber': this.str
          }
          console.log('param3', param3)
          getBack(param3).then(res => {
            console.log(res, '户籍特别行政区回显数据')
            var arr1 = res.data.data.data.xq
            for (var i = 0; i < arr1.length; i++) {
              if (arr1[i].selected === 'selected') {
                this.select1 = arr1[i].id
              }
            }
            var arr2 = res.data.data.data.xzjd
            for (var j = 0; j < arr2.length; j++) {
              if (arr2[j].selected === 'selected') {
                this.select2 = arr2[j].id
              }
            }
            var arr3 = res.data.data.data.sqc
            for (var k = 0; k < arr3.length; k++) {
              if (arr3[k].selected === 'selected') {
                this.select3 = arr3[k].code
              }
            }
          })
          var param4 = {
            'idcardNumber': this.idcardNumber,
            'backCode': this.data.azdf0501,
            'serialNumber': this.str
          }
          getBack(param4).then(res => {
            console.log(res, '常住地行政区划回显数据')
            var arr1 = res.data.data.data.xq
            for (var i = 0; i < arr1.length; i++) {
              if (arr1[i].selected === 'selected') {
                this.select4 = arr1[i].id
              }
            }
            var arr2 = res.data.data.data.xzjd
            for (var j = 0; j < arr2.length; j++) {
              if (arr2[j].selected === 'selected') {
                this.select5 = arr2[j].id
              }
            }
            var arr3 = res.data.data.data.sqc
            for (var k = 0; k < arr3.length; k++) {
              if (arr3[k].selected === 'selected') {
                this.select6 = arr3[k].code
              }
            }
          })
          var param5 = {
            'idcardNumber': this.idcardNumber,
            'backCode': this.data.azdf0007,
            'serialNumber': this.str
          }
          getBack(param5).then(res => {
            console.log(res, '所属地行政区划')
            var arr1 = res.data.data.data.xq
            for (var i = 0; i < arr1.length; i++) {
              if (arr1[i].selected === 'selected') {
                this.select7 = arr1[i].id
              }
            }
            var arr2 = res.data.data.data.xzjd
            for (var j = 0; j < arr2.length; j++) {
              if (arr2[j].selected === 'selected') {
                this.select8 = arr2[j].id
              }
            }
            var arr3 = res.data.data.data.sqc
            for (var k = 0; k < arr3.length; k++) {
              if (arr3[k].selected === 'selected') {
                this.select9 = arr3[k].code
              }
            }
          })
        }
      })
    },
    save: function () {
      this.data.azcp0001 = this.idcardNumber
      this.data.azcp0519 = ''
      // this.data.ssca0002 = '100'
      console.log(this.data)
      var param1 = {
        'request_map': this.data,
        'headers_map': {
          'serialNumber': this.str,
          'idcardNumber': this.idcardNumber
        },
        'url': this.url,
        'code': this.code,
        'request_step': '1',
        'operation_state': this.operation_state
      }
      // if (this.data.azcp0001 === '' || this.data.azcp0001 === undefined) {
      //   this.$Notice.error({ title: '请输入申请人证件号码', desc: '' })
      //   return
      // }
      // if (this.data.azcp0002 === '' || this.data.azcp0002 === undefined) {
      //   this.$Notice.error({ title: '请选择申请人证件类型', desc: '' })
      //   return
      // }
      // if (this.data.azdf0006 === '' || this.data.azdf0006 === undefined) {
      //   this.$Notice.error({ title: '请选择户籍特别行政区', desc: '' })
      //   return
      // }
      // if (this.data.azdf0500 === '' || this.data.azdf0500 === undefined) {
      //   this.$Notice.error({ title: '请填写户籍地详细地址', desc: '' })
      //   return
      // }
      // if (this.data.azdf0501 === '' || this.data.azdf0501 === undefined) {
      //   this.$Notice.error({ title: '请选择常住地行政区划', desc: '' })
      //   return
      // }
      // if (this.data.azdf0008 === '' || this.data.azdf0008 === undefined) {
      //   this.$Notice.error({ title: '请填写常住地详细地址', desc: '' })
      //   return
      // }
      // if (this.data.azdf0007 === '' || this.data.azdf0007 === undefined) {
      //   this.$Notice.error({ title: '请选择所属地行政区划', desc: '' })
      //   return
      // }
      // if (this.data.azcp0003 === '' || this.data.azcp0003 === undefined) {
      //   this.$Notice.error({ title: '请填写申请人姓名', desc: '' })
      //   return
      // }
      createPostNew(param1).then(res => {
        console.log(res, '第一步保存返回的数据')
        this.$Message.success(res.data.data.memo)
        this.$router.push({
          name: 'subsistenceapplication1',
          params: {
            ss11001Id: this.data.ss11001Id || res.data.data.data.ss11001Id,
            ss11002Id: this.data.ss11002Id || res.data.data.data.ss11002Id,
            idcardNumber: this.idcardNumber,
            serialNumber: this.str,
            code: this.code || res.data.data.orderCode,
            see: this.see
          }
        })
      })
    }
  },
  watch: {
    select1 (val) {
      var param1 = {
        'idcardNumber': this.idcardNumber,
        'pid': val,
        'serialNumber': this.str
      }
      // 获取街道信息
      getAdministrativePlanning(param1).then(res => {
        this.data3 = res.data.data.data.divisions
        console.log(res, '调用街道接口返回来的数据')
        console.log(this.data3)
      })
    },
    select2 (val) {
      var param1 = {
        'idcardNumber': this.idcardNumber,
        'pid': val,
        'serialNumber': this.str
      }
      // 社区信息
      getAdministrativePlanning(param1).then(res => {
        this.data4 = res.data.data.data.divisions
        console.log(res, '调用接口返回来的数据')
        console.log(this.data4)
      })
    },
    select3 (val) {
      this.data.azdf0006 = val
    },
    select4 (val) {
      var param1 = {
        'idcardNumber': this.idcardNumber,
        'pid': val,
        'serialNumber': this.str
      }
      getAdministrativePlanning(param1).then(res => {
        this.data5 = res.data.data.data.divisions
        console.log(res, '调用接口返回来的数据')
        console.log(this.data5)
      })
    },
    select5 (val) {
      var param1 = {
        'idcardNumber': this.idcardNumber,
        'pid': val,
        'serialNumber': this.str
      }
      getAdministrativePlanning(param1).then(res => {
        this.data6 = res.data.data.data.divisions
        console.log(res, '调用接口返回来的数据')
        console.log(this.data6)
      })
    },
    select6 (val) {
      this.data.azdf0501 = val
    },
    select7 (val) {
      var param1 = {
        'idcardNumber': this.idcardNumber,
        'pid': val,
        'serialNumber': this.str
      }
      getAdministrativePlanning(param1).then(res => {
        this.data7 = res.data.data.data.divisions
        console.log(res, '调用接口返回来的数据')
        console.log(this.data7)
      })
    },
    select8 (val) {
      var param1 = {
        'idcardNumber': this.idcardNumber,
        'pid': val,
        'serialNumber': this.str
      }
      getAdministrativePlanning(param1).then(res => {
        this.data8 = res.data.data.data.divisions
        console.log(res, '调用接口返回来的数据')
        console.log(this.data8)
      })
    },
    select9 (val) {
      this.data.azdf0007 = val
    }
  },
  mounted () {
    // this.idcardNumber = this.$route.params.cardno
    console.log('身份证号', this.idcardNumber)
    // 判断是否有信息
    let timestamp = new Date().getTime().toString()
    var str1 = Math.ceil(Math.random() * 10)
    var str2 = Math.ceil(Math.random() * 10)
    this.str = str1 + timestamp + str2
    this.getStopInsuranceInfo()
    var param = {
      'idcardNumber': this.idcardNumber,
      'dictsCode': 'ss11001',
      'serialNumber': this.str
    }
    getAppraising(param).then(res => {
      this.data1 = res.data.data.data.CertificateTypeDict
      console.log(res, '调用接口返回来的数据')
      console.log(this.data1)
    })
    var param1 = {
      'idcardNumber': this.idcardNumber,
      'serialNumber': this.str
    }
    getAdministrativePlanning(param1).then(res => {
      this.data2 = res.data.data.data.divisions
      console.log(res, '调用接口返回来的数据')
      console.log(this.data2)
    })
  }
}
</script>
